<template>
    <div>
        <van-nav-bar
          title="详情"
          left-text="返回"
          left-arrow
          @click-left="onBack"
        />
        <template v-for="item in child">
            <van-cell :title="'编号：'+item.ItemNo" :border="false" style="padding: 10px 3px 0px 3px;" :to="'/qc-dtl/'+item.FID"/>
            <van-cell style="padding:0 3px;" :border="false" :to="'/qc-dtl/'+item.FID">
                <span class="custom-title">正唛图</span><van-icon v-if="item.Pic4" name="passed" color="#07c160"/><van-icon v-else name="close" />
                <span class="custom-title">侧唛图</span><van-icon v-if="item.Pic5" name="passed" color="#07c160"/><van-icon v-else name="close" />
                <span class="custom-title">产品图</span><van-icon v-if="item.Pic6" name="passed" color="#07c160"/><van-icon v-else name="close" />
                <span class="custom-title">贴标图</span><van-icon v-if="item.Pic7" name="passed" color="#07c160"/><van-icon v-else name="close" />
                <span class="custom-title">商标图</span><van-icon v-if="item.Pic8" name="passed" color="#07c160"/><van-icon v-else name="close" />
                <span class="custom-title">开箱图</span><van-icon v-if="item.Pic9" name="passed" color="#07c160"/><van-icon v-else name="close" />
            </van-cell>
            <van-cell :title="'数量：'+(item.QCQty?item.QCQty:0) +' 装箱数：'+(item.UnitBoxQty?item.UnitBoxQty:0)+' 箱数：'+(item.PoPurBoxQty?item.PoPurBoxQty:0)" style="padding: 0px 3px 10px 3px;" :to="'/qc-dtl/'+item.FID"/>
        </template>

    </div>
</template>
<script>
  import { Field, Button, Cell, CellGroup, NavBar, Row, Col, Icon } from 'vant'
  import { QCInfo } from '@/api'

  export default {
    components: {
      [NavBar.name]: NavBar,
      [Row.name]: Row,
      [Col.name]: Col,
      [Field.name]: Field,
      [Cell.name]: Cell,
      [CellGroup.name]: CellGroup,
      [Icon.name]: Icon,
      [Button.name]: Button
    },
    data () {
      return {
        child: []
      }
    },
    methods: {
      getInfo (id) {
        QCInfo(id).then((res) => {
          this.child = res.data.child
        })
      },
      onBack () {
        this.$router.back()
      },
    },
    mounted () {
      this.getInfo(this.$route.params.fid)
    }
  }
</script>
<style lang="less">
    .user {
        &-poster {
            width: 100%;
            height: 53vw;
            display: block;
        }
        &-group {
            margin-bottom: 15px;
        }
        &-links {
            padding: 15px 0;
            font-size: 12px;
            text-align: center;
            background-color: #fff;
            .van-icon {
                display: block;
                font-size: 24px;
            }
        }
    }
</style>
